/**
 * VUEshop
 * ============================================================================
 * * 版权所有 2015-2027 深圳搜豹网络科技有限公司，并保留所有权利。
 * 网站地址: http://www.vueshop.com.cn
 * ----------------------------------------------------------------------------
 * 这不是一个自由软件！您只能在不用于商业目的的前提下对程序代码进行修改和使用 .
 * 不允许对程序代码以任何形式任何目的的再发布。
 * ============================================================================
 * $Author: 沈小白 2020-07-22 $
 */<template> 
    <view class="loginwrap">
       <u-navbar title="设置登录密码" :title-color="navBar.titleColor" :back-icon-color="navBar.backIconColor" :title-size="navBar.titleSize" :is-back="navBar.isBack">
           <!-- <view slot="right">跳过</view> -->
       </u-navbar>
       <view class="psd">
           <view class="label">设置密码:</view>
           <input  v-model="password"/>
           <image class="close" @tap="clearPwd" :src="imgUrl+'login/close.png'" v-if="LoginShow"></image>
       </view>
       <view class="validation-btn login-btn" :class="[LoginShow?'validation-btn-select':'']" @tap="register">提交</view>
        <error-template ref="errorTem" :errorText="errorText" type="1"></error-template>
    </view>
</template>
<script>
import config from "@/api/config";
import {register} from "@/api/api.js";
import {mapState,mapActions,mapMutations} from 'vuex';
import common from "@/common/common";
import sendSmsMixin from "@/mixin/sendSms.js";
import ErrorTemplate from "@/components/ErrorTemplate/ErrorTemplate";
import {postLoginCode,sendSms} from "@/api/api.js";
const globalData=getApp().globalData//从app.vue获取用户信息
import Md from "md5";
export default {
    data() {
        return {
          imgUrl:config.imgUrl,
          mobile:"",
          password:"",
          errorText:"",
          navBar:{
              isBack:true,
              titleColor:"#000000",
              titleSize:36,
              backIconColor:"#000000"
          }  
        }
    },
    computed: {
        LoginShow(){
            if(this.password){
                return true;
            }else{
                
                return false
            }
        },
    },
    components:{
        ErrorTemplate
    },
    onLoad(options){
        console.log(options);
        this.mobile=options.tell;
        this.code=options.code;
    },
    methods:{
        ...mapMutations(['login','getToken',]),
		...mapActions(['getUser']),
        register(){
            if(!this.LoginShow){
                return false
            }
            let passwordFlag=common.VerifyPassword(this.password);
            if(!passwordFlag){
                return false
            }
            let password=Md("TPSHOP"+this.password)
            console.log(this.mobile)
            console.log(password)
            let params={
                "mobile":this.mobile,
                "password":password
            }
            register(params).then(res=>{
                console.log(res);
                
            }).then(()=>{
                let params={
                    "mobile":this.mobile,
                    "code":this.code
                }
                this.postLoginCode(params)
            })
        },
        /*清除密码*/ 
        clearPwd(){
            this.password="";
        },
        /*短信验证登录*/    
       postLoginCode(params){
           postLoginCode(params).then(res=>{
               if(!res.msg){
                    // console.log(res)
                    getApp().globalData.userInfo=res; 
                    let token=res.token_type + res.access_token;
                    this.getToken(token)
                    let loginInfo={
                        token: res.token_type + res.access_token,
                        user_id:res.user_id
                    };
                    uni.setStorageSync("userInfo",res)
                    uni.setStorageSync('loginInfo',loginInfo)
                    /*登录成功 调用户信息*/ 
                    this.getUser()
                    this.errorText="提交成功";
                    this.$refs.errorTem.open(3000)
                    setTimeout(this.jump, 3000);
                    return  
                    
               }
           })
       },
       //跳转
        jump() {
            common.jump();
        },
       
    }
}
</script>
<style lang="scss" scoped >
    page{
        background:#fff;
    }
    /deep/.u-slot-right{
        margin-right: 30rpx;
    }
    .loginwrap{
        margin: 0 70rpx;
    }
    .psd{
        display: flex;
        flex-direction: row;
        align-items: center;
        padding: 35rpx 0;
        margin-top: 60rpx;
        border-bottom: 2rpx solid #E5E5E5;
        input{
            margin-left: 30rpx;
            font-size: 36rpx;
        }
    }
    .label{
        color: #333333;
        font-size: 30rpx;
    }
    .close{
        width: 36rpx;
        height: 36rpx;
    }
    .validation-btn{
		width:610rpx;
		height:90rpx;
		margin-bottom: 30rpx;
		background:linear-gradient(90deg,rgba(255,135,135,1) 0%,rgba(255,157,138,1) 100%);
		border-radius:45rpx;
		display: flex;
		flex-direction: row;
		align-items: center;
		justify-content: center;
		color: #fff;
        font-size: 30rpx;
        margin-top: 100rpx;
	}
	.validation-btn-select{
		background:linear-gradient(90deg,rgba(255,59,59,1) 0%,rgba(255,93,61,1) 100%);
	}
</style>